<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Google Charts Tutorial</title>
 
        <!-- load Google AJAX API -->
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
        <!-- Chèn đoạn code Javascript ở đây -->
 		<script type="text/javascript">
    //load the Google Visualization API and the chart
    google.load('visualization', '1', {'packages':['columnchart','piechart']});
 
    //set callback 	
    google.setOnLoadCallback (createChart);
 
    //callback function
    function createChart() {
 
        //create data table object
        var dataTable = new google.visualization.DataTable();
 
        //define columns
        dataTable.addColumn('string','Quarters');
        dataTable.addColumn('number', 'Visits');
        dataTable.addColumn('number', 'Pageviews');
        dataTable.addColumn('number', 'Visitors');
 
        //define rows of data
        dataTable.addRows([
                            ['1', 1037, 4152, 780],
                            ['2', 1116, 5951, 857],
                            ['3', 2439, 5183, 1924],
                            ['4', 3868, 7641, 3095]
                        ]);
 
        //instantiate our chart objects
 
        var chart = new google.visualization.ColumnChart (document.getElementById('chart'));
 
        //define options for visualization
        var options = {width: 800, height: 400, is3D: true, title: 'VietCoding Stats'};
 
        //draw our chart
        chart.draw(dataTable, options);
    }
</script>	
    </head>
 
    <body>
 
        <!--Divs for our charts -->
        <div id="chart"></div>
        <div id="Chart2"></div>
 
    </body>
</html>